<template>
  <div class="nav-bar cf weui-flex ta-c">
    <div class="nav-bar-item weui-flex__item" :class="{'_c': current == 0}" @tap="current = 0">
      <span><a>已提交</a>({{submitedNum || 0}})</span>
    </div>
    <div class="nav-bar-item weui-flex__item" :class="{'_c': current == 1}" @tap="current = 1">
      <span><a>未提交</a>({{unSubmitNum || 0}})</span>
    </div>
  </div>
</template>

<script>

export default {
  props: {
    unSubmitNum: [Number],
    submitedNum: [Number]
  },
  data() {
    return {
      current: 0
    }
  },
  watch: {
    current (nv) {
      this.$emit('change', nv)
    }
  }
}
</script>

<style scoped lang="less">
@import '../../assets/less/var.less';
.nav-bar {
  &-item {
    float: left;
    padding: 10px;
    &.-c {

    }
  }
}
span, a {
  display: inline-block;
  color: @colorGray;
}

._c {
  span, a {
    color: @colorBlack;
  }
  a {
    border-bottom: 5px solid @colorTeal;
  }
}
a {
  margin-right: 5px;
}
</style>
